<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>用户管理</title>
	<script type="text/javascript">
		$(document).ready(function() {
			layui.use('table', function(){
				let table = layui.table;
				table.init('layui-filter-table1',{
					escape : false
					,height: getLayuiTableHeight()
					,className: 'layui-table-custom'
					,done: function (res,curr,count){
					}
				});
			});
			$("#importForm").validate({
				submitHandler: function(form){
					form.submit();
					// let btn = $('#import-btn'),
					// 		initialText = btn.data('initial-text'),
					// 		loadingText = btn.data('loading-text');
					// btn.html(loadingText).addClass('disabled');
					// $.ajax({
					// 	url: $(form).attr('action'),
					// 	type: "POST",
					// 	data: new FormData(form),
					// 	processData: false,
					// 	contentType: false,
					// 	success: function(response,status, xhr) {
					// 		top.$.jBox.tip(response.message,response.status);
					// 		btn.html(initialText).removeClass('disabled');
					// 		if(response.status === 'success'){
					// 			location.reload();
					// 		}
					// 	},
					// 	error: function(xhr, status, error) {
					// 		console.log(xhr)
					// 		layer.alert('表单提交失败：' + xhr.responseText);
					// 		btn.html(initialText).removeClass('disabled');
					// 	}
					// });
				},
				errorClass: 'validation-invalid-label',
				highlight: function(element, errorClass) {
					$(element).removeClass(errorClass);
				},
				errorPlacement: function (error, element) {
					validateErrorPlacement(error, element);
				}
			});

		});
		function importData(){
			layer.open({
				type: 1,
				title:'导入数据',
				offset: 't',
				anim: 'slideDown', // 从下往上
				area: ['100%', '300px'],
				shade: 0.1,
				shadeClose: true,
				content: $('#import-wrapper')
			});
		}
	</script>
</head>

<body>
	<div id="import-wrapper" style="display: none;" class="content">
	<div class="row">
		<div class="col-sm-6">
			<div class="card border-0">
				<div class="card-body">
					<form id="importForm" method="post" enctype="multipart/form-data"
						  action="${ctxAdmin}/sys/user/import4Role">
						<div class="form-group row">
							<div class="col-sm-10 mx-sm-auto">
								<input type="file" name="file" class="required" extension="xlsx"
									   data-msg-required="附件不能为空" data-msg-extension="文件格式不正确">
							</div>
						</div>
						<div class="form-group row">
							<div class="col-sm-10 mx-sm-auto">
								<button id="import-btn" type="submit" class="btn btn-primary btn-loading"
										data-initial-text="<i class='icon-spinner4 mr-2'></i> 导入数据"
										data-loading-text="<i class='icon-spinner4 spinner mr-2'></i> 数据导入中...">
									<i class="icon-spinner4 mr-2"></i>导入数据
								</button>
								<a class="btn btn-outline-primary" href="${ctxAdmin}/sys/user/import/template">
									<i class="icon-arrow-down16 fadeInDown animated infinite mr-2"></i>下载导入数据模板</a>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
		<div class="col-sm-6">
			<div class="card border-0">
				<div class="card-body">
					<h5 class="card-title">
						<a href="#" class="text-default">
							<i class="mi-info mr-2 mi-2x text-primary"></i>
							用户模板填报说明
						</a>
					</h5>
					<ul class="list list-unstyled mb-0">
						<li>
							<i class="mi-filter-1 text-primary"></i>
							模板格式：请保持<span class="text-danger">不变</span>，内容不包含空格，特别是复制粘贴的文字一定要<span class="text-danger">删除前后的空格</span>。
						</li>
						<li>
							<i class="mi-filter-2 text-primary "></i>
							证件类型：默认都是 <span class="badge badge-light text-primary">身份证</span>如果是其他类型证件，请先联系<span class="text-danger">系统管理员</span>。
						</li>
						<li>
							<i class="mi-filter-3 text-primary "></i>
							用户类型：<span class="badge badge-light text-primary">
								<c:forEach items="${fns:getDictList('sys_user_type')}" var="dict">
									${dict.label},
								</c:forEach></span>
							允许多个且之间<span class="text-danger">必须用英文逗号分隔</span>。
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>

</div>
	<sys:message content="${message}"/>
	<div class="card m-0 border-0">
		<form:form id="searchForm" class="form-inline"
				   modelAttribute="user" action="${ctxAdmin}/sys/user/list">
		   	<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
			<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
			<div class="input-group input-group-sm">
				<div class="input-group-prepend">
					<span class="input-group-text">${page.pageNo}登录账号${page.pageSize}</span>
				</div>
				<form:input path="loginName" htmlEscape="false" maxlength="100" class="form-control"/>
			</div>
			<div class="input-group input-group-sm">
				<div class="input-group-prepend">
					<span class="input-group-text">用户姓名</span>
				</div>
				<form:input path="name" htmlEscape="false" maxlength="100" class="form-control"/>
			</div>
			<div class="btn-group btn-group-sm">
				<button type="submit" class="btn btn-primary " onclick="return page();">查询</button>
				<button type="button" class="btn btn-success" onclick="resetForm();page();">重置</button>
			</div>
		</form:form>
		<div id="optButtonGroup" class="p-1">
			<shiro:hasPermission name="sys:user:edit">
				<button class="btn btn-sm btn-outline-primary" onclick="popupLayerLeft('新增用户',$(this).data('url'))"
						data-url="${ctxAdmin}/sys/user/form"><i class="icon-database-add mr-2"></i>新增</button>
				<button class="btn btn-sm btn-outline-primary" onclick="confirmUpdate(this,'layui-table-id1','更新数据')"
						data-url="${ctxAdmin}/sys/user/form?id="><i class="icon-database-edit2 mr-2"></i>修改</button>
				<button class="btn btn-sm btn-outline-primary" onclick="importData()"><i class="icon-database-insert mr-2"></i>导入</button>
				<button class="btn btn-sm btn-outline-danger" onclick="batchConfirmOperation(this,'layui-table-id1')"
						data-url="${ctxAdmin}/sys/user/delete4Role?ids="><i class="icon-database-remove mr-2"></i>删除</button>
			</shiro:hasPermission>
		</div>
		<table id="layui-table-id1" lay-filter="layui-filter-table1" style="display: none;">
			<thead>
			<tr>
				<th lay-data="{field:'numbers',type: 'numbers',align:'center',width:40, fixed: 'left'}">#</th>
				<th lay-data="{field:'checkbox',type: 'checkbox', fixed: 'left'}"></th>
				<th lay-data="{field:'id',hide:true}">ID</th>
				<th lay-data="{field:'o.office_name'}">科室名称</th>
				<th lay-data="{field:'a.name',width:100}">姓名</th>
				<th lay-data="{field:'a.login_name',width:100}">登录账号</th>
				<th lay-data="{field:'a.email',width:140}">邮箱</th>
				<th lay-data="{field:'a.sex',align:'center',width:40}">性别</th>
				<th lay-data="{field:'a.credential_no'}">证件编号</th>
				<shiro:hasPermission name="sys:user:edit">
				</shiro:hasPermission>
			</tr>
			</thead>
			<tbody>
			<c:forEach items="${page.list}" var="user">
				<tr>
					<td></td>
					<td></td>
					<td>${user.id}</td>
					<td>${user.office.name}</td>
					<td>${user.name}</td>
					<td>${user.loginName}</td>
					<td>${user.email}</td>
					<td>${fns:getDictLabel(user.sex, 'sex', '')}</td>
					<td>${user.credentialNo}</td>
					<td></td>
						<%--						<td>${fns:getDictLabel(user.sex,'sex','')}</td>--%>
					<shiro:hasPermission name="biz:dict:dictProject:edit">
					</shiro:hasPermission>
				</tr>
			</c:forEach>
			</tbody>
		</table>
		<sys:laypage page="${page}"/>
	</div>
</body>
</html>